👩‍💻 A Day in the Life – Full Stack Developer

main.jsx — frontend 
// Frontend: kleine carousel + fetch naar KPI-endpoint
import initCarousel from './carousel.js'
const slides = ['hero.jpg', 'shoe-1.jpg', 'shoe-2.jpg']
// autoplay en pauze op hover
const options = { interval: 3000, pauseOnHover: true }
initCarousel(slides, options)

// helpers
export function formatPrice(v){ return `€${v.toFixed(2)}` }

// asynchrone fetch naar backend
async function loadKpis(){
  const res = await fetch('/api/kpi')
  const data = await res.json()
  renderTiles(data)
}
loadKpis()

// DOM-render voor eenvoudige tegels
function renderTiles(data){
  const node = document.querySelector('.tiles')
  node.innerHTML = data.map(x => `<div class="tile">${x.label}: ${x.value}</div>`).join('')
}
server.js — backend (Node + Express) 
// Backend: simpel API-endpoint + (fictieve) database query
import express from 'express'
import pg from 'pg' // PostgreSQL client
const app = express()

// Database pool (voorbeeldconfig)
const pool = new pg.Pool({
  host: 'db.internal', user: 'app', password: '***', database: 'shop', port: 5432
})

// Gezondheidscheck
app.get('/api/health', (req, res) => res.json({ ok: true }))

// KPI-endpoint dat omzet en openstaande orders ophaalt
app.get('/api/kpi', async (req, res) => {
  try{
    const { rows } = await pool.query(`
      SELECT
        (SELECT SUM(total) FROM orders WHERE created_at > now() - interval '1 day') AS omzet_vandaag,
        (SELECT COUNT(*) FROM orders WHERE status = 'open') AS open_orders
    `)
    const kpis = [
      { label: 'Omzet vandaag', value: rows[0]?.omzet_vandaag ?? 0 },
      { label: 'Open orders', value: rows[0]?.open_orders ?? 0 }
    ]
    res.json(kpis)
  } catch(err){
    console.error(err)
    res.status(500).json({ error: 'DB error' })
  }
})

// Start server
app.listen(3000, () => console.log('API running on http://localhost:3000'))

📅 Dagagenda

Frontend Backend Team
🧭 Context & toelichting

Deze dag is opgebouwd als representatieve werkdag van een full stack developer. Er is bewust balans aangebracht tussen frontend (UI, bugfixen, testen) en backend (API, database, logging).

🔎 Verkennend onderzoek
Vacature-analyse (kerncompetenties):
  • Werken met JavaScript/TypeScript + framework (React/Vue) en een backend (Node/Express).
  • API-ontwikkeling en -documentatie; security basics (auth, inputvalidatie).
  • Databases (SQL/NoSQL), migraties, performance en monitoring/logging.
  • Teamprocessen: stand-up, agile (scrum), code review, tickets, releases.
Bronnen:
💬 Persoonlijke reflectie

Vanuit mijn marketing/design-achtergrond neem ik een sterk gevoel voor UX en visuele kwaliteit mee. Omdat ik toekomstbestendig wil zijn, leg ik nu nadruk op backend: API’s, data en security. In deze weergave komen beide kanten samen, zodat ik laat zien hoe ik als full stack developer waarde toevoeg. Met de komst van AI en slimme design-tools (met name op het gebied van front-end en design) ben ik bang dat ik op het designvlak sneller ingehaald word dan ik wil, misschien zelfs al vóór mijn afstuderen. Juist daarom wil ik mezelf uitdagen en veel sterker worden in backend-ontwikkeling: meer leren over databases, API’s en security, zodat ik als full stack developer breed inzetbaar en toekomstproof ben.